<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>甲方对账</title>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="../../../component/elementUI/index.css" />
    <link rel="stylesheet" href="../../../style/wangeditor.css" />
    <link rel="stylesheet" href="../../../style/index.css" />
    <style>
      .el-input.is-disabled .el-input__inner {
        color: #000;
        background-color: #fff;
      }
    </style>
  </head>

  <body>
    <div id="app" v-cloak>
      <el-row :gutter="20">
        <el-col :span="24">
          <el-form :inline="true" :form="form">
            <el-form-item>
              <el-button type="primary" @click="Add">甲方对账申请</el-button>
            </el-form-item>
            <el-form-item>
              <el-input
                v-model.trim="form.Reconciliation_Name"
                clearable
                placeholder="请输入对账单名称"
              />
            </el-form-item>
            <el-form-item>
              <el-input
                v-model.trim="form.Reconciliation_People"
                clearable
                placeholder="请输入对帐人"
              />
            </el-form-item>
            <el-form-item>
              <el-input
                v-model.trim="form.clerk"
                clearable
                placeholder="请输入开票人"
              />
            </el-form-item>
            <el-form-item>
              <el-date-picker
                prefix-icon="el-icon-date"
                v-model="form.Sales_Date"
                clearable
                type="datetimerange"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
                range-separator="至"
                start-placeholder="下单开始日期"
                end-placeholder="下单结束日期"
              ></el-date-picker>
            </el-form-item>
            <!-- <el-form-item>
              <el-input
                v-model.trim="form.Article_Name"
                clearable
                placeholder="请输入商品名称"
              />
            </el-form-item> -->
            <!-- <el-form-item>
              <el-input
                v-model.trim="form.Sales_Order_SerialNumber"
                clearable
                placeholder="请输入销售订单号"
              />
            </el-form-item> -->
            <el-form-item>
              <el-button type="primary" @click="onSerach">查询</el-button>
            </el-form-item>
            <el-form-item>
              <yl-button
                type="success"
                :data="ExportData"
                :loading="loading"
                @click="Export(form)"
                >销售对账表导出</yl-button
              >
            </el-form-item>
          </el-form>
        </el-col>
        <el-col :span="24">
          <el-table
            :data="tableData.slice((form.page-1)*form.limit,form.page*form.limit)"
            stripe
            border
            height="calc(100vh - 140px)"
            style="width: 100%"
          >
            <el-table-column
              align="center"
              type="index"
              label="序号"
              width="50"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="BilName"
              width="300"
              show-overflow-tooltip
              label="对账单名称"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Department_Reconciliation_SerialNumber"
              width="300"
              show-overflow-tooltip
              label="对账单编号"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Submit_Date"
              width="300"
              show-overflow-tooltip
              label="提交日期"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="PartyALink"
              width="180"
              show-overflow-tooltip
              label="对帐人"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="KP_UserName"
              width="180"
              show-overflow-tooltip
              label="开票人"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="SealsAmount"
              width="150"
              show-overflow-tooltip
              label="金额"
            ></el-table-column>
            <!-- <el-table-column
              align="center"
              prop="name"
              width="150"
              show-overflow-tooltip
              label="平台总价"
            ></el-table-column> -->
            <el-table-column
              align="center"
              prop="Sales_Amount"
              width="140"
              show-overflow-tooltip
              label="积分总价"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Invoice_SerialNumber"
              width="300"
              show-overflow-tooltip
              label="发票号"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="PartyALink"
              width="140"
              show-overflow-tooltip
              label="联系人"
            ></el-table-column>
            <el-table-column
              prop="KP_Status"
              label="发票状态"
              width="120"
              :filters="[{ text: '未开发票', value: '0' }, { text: '已开发票', value: '1' }]"
              :filter-method="filterTag"
              filter-placement="bottom-end"
            >
              <template slot-scope="scope">
                <el-tag
                  :type="scope.row.KP_Status=='0'?'':'success'"
                  disable-transitions
                >
                  {{scope.row.KP_Status=='0'?'未开发票':'已开发票'}}
                </el-tag>
              </template>
            </el-table-column>

            <el-table-column
              prop="Receipts_Status"
              label="打款状态"
              width="100"
              :filters="[{ text: '已回款', value: '1' }, { text: '未回款', value: '0' }]"
              :filter-method="filterTag1"
              filter-placement="bottom-end"
            >
              <template slot-scope="scope">
                <el-tag
                  :type="scope.row.Receipts_Status=='0' ? 'warning':'success'"
                  disable-transitions
                  >{{scope.row.Receipts_Status == 0 ? '未回款' :
                  '已回款'}}</el-tag
                >
              </template>
            </el-table-column>
            <!-- <el-table-column
              align="center"
              prop="Department_Name"
              width="140"
              show-overflow-tooltip
              label="甲方企业"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Number"
              width="140"
              show-overflow-tooltip
              label="对账订单数"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Submit_Date"
              width="160"
              show-overflow-tooltip
              label="对账时间"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Activity_Name"
              min-width="250"
              show-overflow-tooltip
              label="参议过活动"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Article_Name"
              min-width="250"
              show-overflow-tooltip
              label="已购商品汇总"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Quantity"
              width="110"
              show-overflow-tooltip
              label="购买商品数量"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Sales_Amount"
              width="110"
              show-overflow-tooltip
              label="对账消费总额"
            >
              <template v-slot="{row}">
                {{thousands(row.Sales_Amount)}}
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              prop="Reality_Amount"
              width="110"
              show-overflow-tooltip
              label="实际收款总额"
            >
              <template v-slot="{row}">
                {{thousands(row.Reality_Amount)}}
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              prop="Sales_Point"
              width="110"
              show-overflow-tooltip
              label="累加使用积分"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Invoice_Amount"
              width="110"
              show-overflow-tooltip
              label="已开票总额"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="Remain_Amount"
              width="110"
              show-overflow-tooltip
              label="剩余未开票额"
            ></el-table-column> -->
            <el-table-column
              align="center"
              fixed="right"
              label="操作"
              width="250"
            >
              <template v-slot="{row}">
                <el-button
                  type="primary"
                  size="small"
                  @click="Show(row.Department_Reconciliation_SerialNumber )"
                  >详情</el-button
                >
                <el-button
                  type="success"
                  size="small"
                  @click="handleinvoice(row)"
                  >开票</el-button
                >
                <el-button
                  type="danger"
                  size="small"
                  @click="jsd(row)"
                  :disabled="a"
                  >结算单</el-button
                >
              </template>
            </el-table-column>
          </el-table>
          <el-dialog title="结算单" :visible.sync="dialogFormVisible">
            <el-form :model="js">
              <el-form-item label="采购单号" :label-width="formLabelWidth">
                <el-input
                  v-model="js.Purchase_SerialNumber"
                  autocomplete="off"
                ></el-input>
              </el-form-item>
              <el-form-item label="结算单号" :label-width="formLabelWidth">
                <el-input
                  v-model="js.Clearing_SerialNumber"
                  autocomplete="off"
                ></el-input>
              </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
              <el-button @click="dialogFormVisible = false">取 消</el-button>
              <el-button type="primary" @click="jsqd">确 定</el-button>
            </div>
          </el-dialog>
          <el-pagination
            style="margin-top: 5px"
            background
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="form.page"
            :page-sizes="[10 ,20, 30, 50, 100]"
            :page-size="form.limit"
            layout="total, sizes, prev, pager, next, jumper"
            :total="tableData.length"
          >
          </el-pagination>
        </el-col>
      </el-row>
      <invoice :data="data" :visible.sync="dialogInvoiceVisible"></invoice>
      <show-detail
        :visible.sync="dialogVisible"
        :id="Department_Reconciliation_SerialNumber "
      ></show-detail>
    </div>
    <script type="text/javascript" src="../../../utils/wangeditor.js"></script>
    <script type="text/javascript" src="../../../utils/jquery.min.js"></script>
    <script
      type="text/javascript"
      src="../../../utils/jquery.cookie.js"
    ></script>
    <script type="text/javascript" src="../../../utils/vue.min.js"></script>
    <script type="text/javascript" src="../../../utils/vuex.min.js"></script>
    <script
      type="text/javascript"
      src="../../../component/elementUI/index.js"
    ></script>
    <script
      type="text/javascript"
      src="../../../component/component.js"
    ></script>
    <script
      type="text/javascript"
      src="../../../utils/FileSaver.min.js"
    ></script>
    <script type="text/javascript" src="../../../utils/FileSaver.js"></script>
    <script
      type="text/javascript"
      src="../../../utils/xlsx.full.min.js"
    ></script>
    <script
      type="text/javascript"
      src="../../../utils/xlsx.core.min.js"
    ></script>
    <script type="text/javascript" src="../../../config/config.js"></script>
    <script type="text/javascript" src="../../../utils/compressor.js"></script>
    <script type="text/javascript" src="../../../utils/ID_Validity.js"></script>
    <script type="text/javascript" src="../../../utils/utils.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
  </body>
</html>
